<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>选择器</title>
		<style>
			img{
				width: 300px;
			}
		</style>
		<!-- 引入jquery -->
		<script src="js/jquery-3.7.0.min.js"></script>
		<script>
			 $(function(){
				 $("img").hover(function(){
					 $(this).width("350px").height("350px")
				 },function(){
					 $(this).width("300px").height("300px")
				 })
				 $(":button").click(function(){
					 //alert('111111111')
					 $("img").toggle();
				 })
			 })
		</script>
	</head>
	<body>
		<p>
			页面加载时绑定事件
			点击按钮，让图片显示或隐藏；
			鼠标悬停或离开可以使图片放大或缩小；
		</p>
		   <p>
			  <input type="button" value="按钮"/>
		   </p>
		   
		   <p>
			   <img src="img/食物/食物1.jpg"/>
		   </p>
		   
	</body>
</html>